<template>
	<view class="invoice-manage rf-row-wrapper">
		<view class="row b-b">
			<text class="tit">发票类型</text>
			<radio-group class="invoice-type" @change="handleInvoiceTypeChange">
				<label
					class="invoice-type-item"
					v-for="(item, index) in invoiceType"
					:key="index"
				>
					<radio
						class="gender-item-radio"
						size="small"
						:color="themeColor.name"
						:value="'' + item.value"
						:checked="item.value === invoiceData.titleType"
					/>
					<text class="gender-item-text">{{ item.name }}</text>
				</label>
			</radio-group>
		</view>
		<view class="row b-b">
			<text class="tit">发票抬头</text>
			<input
				class="input"
				type="text"
				v-model="invoiceData.companyName"
				placeholder="请输入发票抬头"
				placeholder-class="placeholder"
			/>
		</view>
		<view class="row b-b" v-if="invoiceData.titleType  == '1'">
			<text class="tit">发票税号</text>
			<input
				class="input"
				type="text"
				v-model="invoiceData.taxId"
				placeholder="请输入发票税号"
				placeholder-class="placeholder"
			/>
		</view>
		<view class="row b-b" v-if="invoiceData.titleType  == '1'">
			<text class="tit">注册地址</text>
			<input
				class="input"
				type="text"
				v-model="invoiceData.registerAddress"
				placeholder="请输入注册地址"
				placeholder-class="placeholder"
			/>
		</view>
		<view class="row b-b" v-if="invoiceData.titleType  == '1'">
			<text class="tit">电话</text>
			<input
				class="input"
				type="text"
				v-model="invoiceData.registerMobile"
				placeholder="请输入电话"
				placeholder-class="placeholder"
			/>
		</view>
		<view class="row b-b" v-if="invoiceData.titleType  == '1'">
			<text class="tit">开户行</text>
			<input
				class="input"
				type="text"
				v-model="invoiceData.openBank"
				placeholder="请输入开户行"
				placeholder-class="placeholder"
			/>
		</view>
		<view class="row b-b" v-if="invoiceData.titleType  == '1'">
			<text class="tit">银行帐号</text>
			<input
				class="input"
				type="text"
				v-model="invoiceData.bankAccount"
				placeholder="请输入银行帐号"
				placeholder-class="placeholder"
			/>
		</view>
		<view class="row default-row">
			<text class="tit">设为默认</text>
			<switch
				:checked="invoiceData.isDefault ? true : false"
				:color="themeColor.name"
				@change="switchChange"
			/>
		</view>
		<button
			class="add-btn"
      :class="'bg-' + themeColor.name"
			:disabled="btnLoading"
			:loading="btnLoading"
			@tap="confirm"
		>
			提交
		</button>
	</view>
</template>

<script>
import { invoiceCreate, invoiceUpdate, invoiceDetail } from '@/api/userInfo'

export default {
  data () {
    return {
      invoiceData: {
        titleType: '1',
        title: '',
        duty_paragraph: '',
        isDefault: ''
      },
      invoiceType: [
        { name: '公司', value: '1' },
        { name: '个人', value: '2' }
      ],
      reqBody: {},
      btnLoading: false
    }
  },
  onLoad (options) {
    this.initData(options)
  },
  methods: {
    async initData (options) {
      let title = '新增发票'
      if (options.type === 'edit') {
        title = '编辑发票'
        await this.getInvoiceDetail(options.id)
      }
      this.manageType = options.type
      uni.setNavigationBarTitle({
        title
      })
    },
    // 获取发票详情
    async getInvoiceDetail (id) {
      await this.$http
        .get(`${invoiceDetail}`, {
          id
        })
        .then(async r => {
          this.invoiceData = r
        })
    },
    handleInvoiceTypeChange (e) {
      this.invoiceData.titleType = e.detail.value
      console.log('invoice:', this.invoiceData)
    },
    switchChange (e) {
      this.invoiceData.is_default = e.detail.value ? '1' : '0'
    },
    // 提交
    confirm () {
			 console.log('invoice:', this.invoiceData)
      if (this.invoiceData.companyName == null) {
        this.$mHelper.toast('发票抬头不能为空')
        return
      }
      if (parseInt(this.invoiceData.titleType, 10) === 1) {

      } else if (parseInt(this.invoiceData.titleType, 10) === 2) {

      }
      this.btnLoading = true
      if (this.manageType === 'edit') {
        this.handleInvoiceUpdate(this.invoiceData)
      } else {
        this.handleInvoiceCreate(this.invoiceData)
      }
    },
    // 编辑发票
    async handleInvoiceUpdate (params) {
      await this.$http
        .put(`${invoiceUpdate}?id=${params.id}`, params)
        .then(() => {
          this.btnLoading = false
          this.$mHelper.toast('恭喜您, 发票修改成功！')
          this.$mRouter.back()
        })
        .catch(() => {
          this.btnLoading = false
        })
    },
    // 新增发票
    async handleInvoiceCreate (params) {
      await this.$http
        .post(`${invoiceCreate}`, params)
        .then(() => {
          this.btnLoading = false
          this.$mHelper.toast('恭喜您, 发票添加成功！')
          this.$mRouter.back()
        })
        .catch(() => {
          this.btnLoading = false
        })
    }
  }
}
</script>

<style lang="scss">
page {
	background: $page-color-base;
}
.invoice-manage {
	padding-top: $spacing-base;
	.invoice-type-item {
		margin-right: $spacing-base;
		.gender-item-text {
			margin-left: $spacing-sm;
		}
	}
}
</style>
